﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>KML Circle Generator by tigerllihao</title>
		<link rel="shortcut icon" href="/favicon.ico"/>
		<link rel="icon" href="/favicon.png"/>
		<style type="text/css" media="screen">
                div#head {height:70px;width:400px;margin:20px auto;}
                div#forms {clear:both;width:400px;margin:20px auto;}
                div#forms p {text-align: center;font-size: 14px;line-height:35px;}
                label{width:150px;display:block;float:left;text-align: right;}
                div#head img {display: block;float:left;}
                div#title {font-size: 32px;font-family: Arial, sans-serif;line-height:40px;height:40px;}
                div#author {font-size: 16px;font-style: italic;line-height:20px;text-align: right;height:20px;}
		</style>
	</head>
	<body>
		<div id="head">
			<img src="/icon64.png" width="64" height="64" alt="KCG"/>
			<div id="title">KML Circle Generator</div>
			<div id="author">by <a href="http://blog.tigerlihao.com" target="_blank">tigerlihao</a></div>
		</div>
		<div id="forms">
			<form action="/circle" method="post">
				<fieldset>
					<legend>Get Circle</legend>
					<p>
						<label for="lon">longitude:</label>
						<input type="text" name="lon" id="lon"/>&deg;<br/>
						<label for="lat">latitude:</label>
						<input type="text" name="lat"  id="lat"/>&deg;<br/>
						<label for="r">radius:</label>
						<input type="text" name="r"  id="r"/>&deg;<br/>
						<input type="submit" value="Get KML"/>
					</p>
				</fieldset>
			</form>
			<form action="/arc" method="post">
				<fieldset>
					<legend>Get Arc</legend>
					<p>
						<label for="arc_lon">longitude:</label>
						<input type="text" name="lon" id="arc_lon"/>&deg;<br/>
						<label for="arc_lat">latitude:</label>
						<input type="text" name="lat"  id="arc_lat"/>&deg;<br/>
						<label for="arc_r">radius:</label>
						<input type="text" name="r"  id="arc_r"/>&deg;<br/>
						<label for="start">start direction:</label>
						<input type="text" name="start"  id="start"/>&deg;<br/>
						<label for="end">end direction:</label>
						<input type="text" name="end"  id="end"/>&deg;<br/>
						<input type="submit" value="Get Arc"/>
					</p>
				</fieldset>
			</form>
		</div>
	</body>
</html>